<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>

    <title>Viewing</title>

    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <meta name="author" content=""/>
    <meta name="description" content=""/>
    <meta name="keywords" content=""/>

    <link rel="stylesheet" href="css/main.css"/>
    <link rel="Stylesheet" href="css/ui.selectmenu.css" type="text/css"/>

    <link href="favicon.ico" rel="shortcut icon"/>
    <link href="apple-icon.png" rel="apple-touch-icon"/>


    <script type="text/javascript" src="js/jquery/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui.min.js"></script>
    <script type="text/javascript" src="js/ui.selectmenu.js"></script>
    <script type="text/javascript" src="js/scripts.js"></script>

</head>

<body>
<f:view>
    <h:form id="registrationForm">
        <div class="android-wrap">

            <div id="wrapper">
                <div id="header">
                    <h1 class="title">Registration</h1>
                    <ul class="app-controls">
                        <li>
                                <%--<a href="#" class="appc-back">About</a>--%>
                            <h:commandLink action="#{appBean.toLogin}" value="Back" styleClass="appc-back"/>
                        </li>
                    </ul>
                </div>
                <div id="content">

                    <h2 class="e-title">Please fill in the form below </h2>

                    <div class="sign-in min">
                            <%--<form action="" method="post">--%>
                        <fieldset>
                            <h:inputText styleClass="f-phone" value="#{appBean.phoneNumber}">
                                <placeholder> Phone number</placeholder>
                            </h:inputText>
                        </fieldset>
                        <fieldset>
                                <%--<input type="password" class="f-password" placeholder="Password"/>--%>

                            <h:inputText styleClass="f-password" value="#{appBean.password}">
                                <%--<placeholder> Password </placeholder>--%>
                            </h:inputText>
                        </fieldset>

                        <fieldset>
                                <h:inputText styleClass="f-password"  value="#{appBean.repeatPassword}">
                            </h:inputText>
                        </fieldset>

                        <fieldset class="f-age">
                            <label class="f-title">Age</label>
                            <h:selectOneMenu value="#{appBean.currentAge}" styleClass="styled">
                                <f:selectItems value="#{appBean.ages}"/>
                            </h:selectOneMenu>
                        </fieldset>
                        <fieldset class="f-sex">
                            <label class="f-title">Sex</label>

                            <h:commandLink action="#{appBean.switchToMale}">
                                <h:graphicImage value="#{appBean.male}"/>
                            </h:commandLink>

                            <h:commandLink action="#{appBean.switchToFemale}">
                                <h:graphicImage value="#{appBean.female}"/>
                            </h:commandLink>

                        </fieldset>
                        <fieldset>
                                <%--<input type="submit" class="global-ui-btn orange-btn last-child" value="Register" />--%>
                            <h:commandButton value="Register" styleClass="global-ui-btn orange-btn last-child"
                                             action="#{appBean.registerNewPerson}"/>
                        </fieldset>
                            <%--</form>--%>
                    </div>

                </div>
            </div>
            <%--<a href="#" class="android-control back-btn">Back</a>--%>
             <h:commandLink action="#{appBean.toLogin}" value="Back" styleClass="android-control back-btn"/>
        </div>
    </h:form>
</f:view>
</body>
</html>